<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<div class="col-md-6 col-sm-6 col-xs-12 mar">
	<form id="roleAddForm" class="form-horizontal">
		<div class="col-md-12 col-sm-12 col-xs-12 mar">
			<div class="form-group">
				<div class="input-group">
					<span class="input-group-addon">角色名称</span><input class="form-control" name="name" type="text">
				</div>
			</div>
		</div>
		<div class="col-md-12 col-sm-12 col-xs-12 mar">
			<div class="form-group">
				<div class="input-group">
					<span class="input-group-addon">英文名称</span><input class="form-control" name="eName" type="text">
				</div>
			</div>
		</div>
		<div class="col-md-12 col-sm-12 col-xs-12 mar">
			<div class="form-group">
				<div class="input-group">
					<span class="input-group-addon">角色授权</span><input type="hidden" name="authIds" id="authIds1" value="" /><ul id="treeAuths" class="ztree"></ul>
				</div>
			</div>
		</div>
		<div class="col-md-12 col-sm-12 col-xs-12 mar">
			<div class="form-group">
				<div class="input-group">
					<span class="input-group-addon">备注</span><textarea class="form-control" cols="40" rows="3" name="remarks"></textarea>
				</div>
			</div>
		</div>
		<div class="col-md-12 col-sm-12 col-xs-12 mar">
			<div class="input-group">
				<button class="btn btn-primary" type="button" id="saveNewRole">保存</button>
				&nbsp;&nbsp;<input class="btn btn-default" type="reset" value="返回">
			</div>
		</div>
	</form>	
</div>
<script type="text/javascript">

/* bootstrap 验证表单是否为空 */
$(function() {
	$("#roleAddForm").bootstrapValidator({
		live : 'enabled',//验证时机，enabled是内容有变化就验证（默认），disabled和submitted是提交再验证
		excluded : [ ':disabled', ':hidden', ':not(:visible)' ],//排除无需验证的控件，比如被禁用的或者被隐藏的
		message : '通用的验证失败消息',//好像从来没出现过
		feedbackIcons : {//根据验证结果显示的各种图标
			valid : 'glyphicon glyphicon-ok',
			invalid : 'glyphicon glyphicon-remove',
			validating : 'glyphicon glyphicon-refresh'
		},
		fields : {
			name: {//验证input项：验证规则
                message: '角色名',
                validators: {
                    notEmpty: {//非空验证：提示消息
                        message: '角色名不能为空'
                    },
                    stringLength: {
                        min: 1,
                        max: 10,
                        message: '角色名长度必须在1到10之间'
                    },
                    threshold :  6 , //有6字符以上才发送ajax请求，（input中输入一个字符，插件会向服务器发送一次，设置限制，6字符以上才开始）
                    remote: {//ajax验证。server result:{"valid",true or false} 向服务发送当前input name值，获得一个json数据。例表示正确：{"valid",true}  
                        url: 'role/checkAddName',//验证
                      	message: '角色名已存在',//提示消息
                        delay :  2000,//每输入一个字符，就发ajax请求，服务器压力还是太大，设置2秒发送一次ajax（默认输入一个字符，提交一次，服务器压力太大）
                        type: 'POST'//请求方式
                    }
                }
            },
			eName: {
			validators : {
				notEmpty : {
					message : '文本框必须输入'
				}
			}
		  }
		}
	});
});


//配置节点参数
var setting = {	
		check:{           
          enable: true //每个节点上是否显示 CheckBox
      },
      data: {        	
      	 key : {
             title : "name",    
             name : "name"
           },
          simpleData: {//简单数据模式
              enable:true,
              idKey: "id",
              pIdKey: "parentId",
              rootPId: null
          }
      }      
  };	

//显示机构信息
function showMenu(obj1, obj2){
	$.ajax({
		url:obj1,	
		type:'post',
		dataType:'json',
		data:obj2,
		success:function(data){
			if(data.status==200){
				var type  = data.result;
				console.log(type)
				$.fn.zTree.init($("#treeAuths"), setting, type);
			}
		}
	});
}

//提交表单roleForm
$('#saveNewRole').click(function(){
	var treeObj = $.fn.zTree.getZTreeObj("treeAuths");  //1. 获取 id 为 menuTree 的 zTree 对象
	var nodes = treeObj.getCheckedNodes(true);//在提交表单之前将选中的checkbox的Id收集
	var array = new Array();
	for(var i=0; i<nodes.length; i++){
		array.push(nodes[i].id);
	}
	var authIds = array.join(",");   //拼接成被选中的checkbox的Id字符串
	$("#roleAddForm input[name='authIds']").val(authIds); //将这种id字符串赋值给name=authId的input（隐藏域）
	$("#roleAddForm").bootstrapValidator('validate'); //提交验证  
	if($("#roleAddForm").data('bootstrapValidator').isValid()) { 
		$.ajax({
			url:'role/add',	
			type:'post',
			dataType:'json',
			data:$("#roleAddForm").serialize(),
			success:function(data){
				if(data.status==200){
					alert(data.msg);
					loadRoleInfo();
					$('#getRolefind').click();
				}
			}
		});
		$("#roleAddForm")[0].reset();
		$("#roleAddForm").data('bootstrapValidator').destroy();
		$("#roleAddForm").data('bootstrapValidator',null);
	}
});

//加载权限树
$(function(){
	showMenu('menu/list', null);
});
</script>
